<template>
  <div>
    <h1>ref</h1>
    <div>年龄：{{age}}</div>
  </div>

</template>

<script>
//vue3.0 按需加载
//引入ref
import {defineComponent, ref} from 'vue';
export default defineComponent({
  name: 'HelloWorld',
  //setup在创建前执行
  setup(props,context){
    console.log("setup,composition API执行的入口");
    //定义变量
    const age = ref(10);//ref 一般创建 基础类型的变量，创建的变量再次赋值时需要写 变量名.value = 变量值
    setTimeout(()=>{//过两秒修改了age的值，页面会不会是响应式的
      age.value = 20;
    },2000);
    return {age};
  },
})
</script>
